import 'package:flutter/material.dart';
import 'package:happy_elf_app/apis/home.dart';
import 'package:happy_elf_app/store/config.dart';
import 'package:happy_elf_app/store/home.dart';
import 'package:happy_elf_app/utils/globalKey.dart';
import 'package:happy_elf_app/utils/themColor.dart';
import 'package:happy_elf_app/views/Home/track/report.dart';
import 'package:happy_elf_app/views/Home/track/tracking.dart';
import 'package:happy_elf_app/widgets/headerBack/index.dart';

class Track extends StatefulWidget {
  const Track({Key? key, this.callback}) : super(key: key);

  final Function? callback;
  @override
  State<Track> createState() => _TrackState();
}

class _TrackState extends State<Track> with SingleTickerProviderStateMixin {
  late AnimationController _controller;
  final HomeDataProvider = Provider.of<HomeData>(
    Global.navigatorKey.currentContext!,
    listen: false,
  );

  int page = 0;

  List taggerList = [
    {'title': '开启新的目标', 'type': '1'},
    // {'title': '导入任务拆分', 'type': '2'},
    // {'title': '添加空白任务追踪（无精灵版本）', 'type': '3'},
  ];
  List dataList = [];

  @override
  void initState() {
    super.initState();
    getData();
    _controller = AnimationController(vsync: this);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void getData() async {
    dataList = [];
    var res = await Home().getTarget();
    if (res['code'] == 200) {
      dataList = res['data'];
      setState(() {});
    }
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          HeaderBack(
            title: page == 2 ? '情绪报告' : '任务追踪',
            isFirst: page != 0,
            callback: () {
              page -= 1;
              setState(() {});
            },
          ),
          page == 0
              ? Container(
                  height: 660,
                  padding: const EdgeInsets.all(10),
                  child: Column(
                    children: [
                      ...taggerList.map((e) => Container(
                            margin: const EdgeInsets.only(bottom: 10),
                            child: GestureDetector(
                              child: Container(
                                  width: 352,
                                  height: 60,
                                  decoration: ShapeDecoration(
                                    color: Colors.white,
                                    shape: RoundedRectangleBorder(
                                      side: const BorderSide(
                                          width: 0.33, color: Colors.white),
                                      borderRadius:
                                          BorderRadius.circular(10.02),
                                    ),
                                    shadows: const [
                                      BoxShadow(
                                        color: Color(0x0C000000),
                                        blurRadius: 1.34,
                                        offset: Offset(2, 2),
                                        spreadRadius: 0.33,
                                      )
                                    ],
                                  ),
                                  child: Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: [
                                      Text(e['title'],
                                          style: const TextStyle(
                                              color: Color(0xFF333333),
                                              fontSize: 16)),
                                      Image.asset(
                                        'lib/assets/images/home/track/arrow_right.png',
                                        width: 24,
                                        height: 24,
                                      ),
                                    ],
                                  )),
                              onTap: () {
                                widget.callback!();
                              },
                            ),
                          )),
                      Expanded(
                          child: ListView.builder(
                              itemCount: dataList.length,
                              itemBuilder: (context, index) {
                                // 获取当前 index 对应的数据
                                var item = dataList[index];
                                return GestureDetector(
                                  onTap: () {
                                    // 选中的目标
                                    HomeDataProvider.setTarget({
                                      'id': item['id'],
                                      'typeId': item['typeId'],
                                      'content': item['goalName'],
                                      'createTime': item['createTime']
                                    });
                                    setState(() {
                                      page = 1;
                                    });
                                  },
                                  child: Container(
                                    width: 352,
                                    height: 60,
                                    padding:
                                        EdgeInsets.symmetric(horizontal: 16),
                                    decoration: BoxDecoration(
                                      border: Border.all(
                                          width: item['status'] == 1 ? 1 : 0,
                                          color: hexColor('#cccccc')),
                                      color: hexColor(item['status'] == 1
                                          ? '#ffffff'
                                          : '#e9e9e9'),
                                      borderRadius: BorderRadius.circular(10),
                                    ),
                                    margin: const EdgeInsets.only(bottom: 10),
                                    child: Row(
                                      children: [
                                        Text(item['goalName'] ?? ''),
                                        SizedBox(
                                          width: 16,
                                        ),
                                        Text(
                                          item['status'] == 1
                                              ? '(进行中)'
                                              : '(已完成)',
                                          style: TextStyle(
                                              color: hexColor('#666666')),
                                        )
                                      ],
                                    ),
                                  ),
                                );
                              }))
                    ],
                  ),
                )
              : page == 1
                  ? Tracking(
                      callBack: ({type}) {
                        if (type == 'add') {
                          page = 0;
                        } else {
                          page = 2;
                        }
                        setState(() {});
                      },
                    )
                  : Report()
        ],
      ),
    );
  }
}
